<template>
  <div class="container">
    <!-- 面包屑 -->
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ name: 'log.list' }">记录</el-breadcrumb-item>
      <el-breadcrumb-item>{{ log?.date }}</el-breadcrumb-item>
    </el-breadcrumb>

    <!-- 文本框 -->
    <div class="input">
      {{ log?.content }}
    </div>
  </div>
</template>

<script setup lang="ts">
import { useRoute } from 'vue-router'
import useLog from '@renderer/composables/useLog'

const route = useRoute()
const { find, log } = useLog()

find(+route.params.id)
</script>

<style lang="scss" scoped>
.container {
  @apply p-3;
  .input {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    // -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    @apply text-gray-500 text-sm mt-3 border border-gray-400 rounded-sm p-3;
  }
  .search {
    @apply mt-4 w-2/3;
  }
  .table {
    @apply mt-3 w-full;
  }
  .btn {
    @apply mt-3 flex justify-end;
  }
}
</style>
